iT邦幫忙

2021 iThome 鐵人賽

DAY 17
0
永豐金融APIs

視覺化跨平台Client與永豐金融證券APIs系列 第 17

視覺化當日趨勢圖(1)-client端架設&&工具篇

  • 分享至 

  • xImage
  •  

昨天我們完成了用Flask撰寫ticks API,
API端好了之後,接下來我們要開始架設我們的client端,
client要處理視覺化(html+css+js)和接收API端資料,
而我們client端是用JAVA來撰寫,
所以今天要先開始架設JAVA專案,
JAVA的框架有很多種,我選用的是Spring boot,
他可以減免掉架設專案的很多設定,
IDE選用的是STS(spring-tool-suite)
https://spring.io/tools
下載完後開啟STS,準備建立專案,
https://ithelp.ithome.com.tw/upload/images/20211002/20107848gfpLbGzKrD.jpg
選擇Spring start project,
並把專案取名為ShioajiClient,
設定如圖,設定完後一直下一步就能建立完成專案,
https://ithelp.ithome.com.tw/upload/images/20211002/20107848L6kqehoz4f.jpg
Spring boot專案我們使用pom.xml來管理我們的庫,
以下範例是我常用的庫,可複製蓋掉pom.xml的內容,

<dependencies>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-tomcat</artifactId>
			<scope>provided</scope>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>
		<!--熱佈署不需重啟專案 -->
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-devtools</artifactId>
			<optional>true</optional>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-security</artifactId>
	 	</dependency>
	 	<dependency>
			<groupId>org.json</groupId>
			<artifactId>json</artifactId>
			<version>20160810</version>
		</dependency>
		<dependency> 
			<groupId>com.google.code.gson</groupId> 
			<artifactId>gson</artifactId> 
		</dependency>
	 	<!-- 常用工具包 -->
		<dependency>
			<groupId>org.apache.commons</groupId>
			<artifactId>commons-lang3</artifactId>
		</dependency>
	 	<dependency>
			<groupId>org.jsoup</groupId>
			<artifactId>jsoup</artifactId>
			<version>1.11.3</version>
		</dependency>
		<dependency>
		    <groupId>org.projectlombok</groupId>
		    <artifactId>lombok</artifactId>
		    <version>1.18.12</version>
		    <scope>provided</scope>
		</dependency>
		<dependency>
		    <groupId>commons-codec</groupId>
		    <artifactId>commons-codec</artifactId>
		    <version>1.9</version>
		</dependency>
	</dependencies>
	<build>
		<plugins>
			<plugin>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
			</plugin>
			<plugin>
				<groupId>org.apache.maven.plugins</groupId>
				<artifactId>maven-surefire-plugin</artifactId>
				<configuration>
					<useSystemClassLoader>false</useSystemClassLoader>
					<encoding>UTF-8</encoding>
				</configuration>
			</plugin>
		</plugins>
	</build>
	
	<repositories>
		<repository>
			<id>spring-snapshots</id>
			<name>Spring Snapshots</name>
			<url>https://repo.spring.io/snapshot</url>
			<snapshots>
				<enabled>true</enabled>
			</snapshots>
		</repository>
		<repository>
			<id>spring-milestones</id>
			<name>Spring Milestones</name>
			<url>https://repo.spring.io/milestone</url>
			<snapshots>
				<enabled>false</enabled>
			</snapshots>
		</repository>
	</repositories>
	<pluginRepositories>
		<pluginRepository>
			<id>spring-snapshots</id>
			<name>Spring Snapshots</name>
			<url>https://repo.spring.io/snapshot</url>
			<snapshots>
				<enabled>true</enabled>
			</snapshots>
		</pluginRepository>
		<pluginRepository>
			<id>spring-milestones</id>
			<name>Spring Milestones</name>
			<url>https://repo.spring.io/milestone</url>
			<snapshots>
				<enabled>false</enabled>
			</snapshots>
		</pluginRepository>
	</pluginRepositories>

更新完pom.xml內容記得專案右鍵Maven update更新一下專案!
這樣就基本建立一個JAVA專案,
剩下視覺化還會使用的的工具還有圖表的JS,
依照個人喜好可以使用
Highcharts、chart.js、d3.js等等來製作圖表。


上一篇
Flask API-取得request資料(以ticks API為例)
下一篇
視覺化當日趨勢圖(2)-client端設定檔&&建立controller、service
系列文
視覺化跨平台Client與永豐金融證券APIs30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言